<template>
	<view class="goods-card">
		<view class="left" @click="$u.route(`/pages/goods/detail?id=${goods.goodsId}`)">
			<Img :src="goods.goodsImage" />
		</view>
		<view class="right u-m-l-24">
			<view class="u-line-2 u-font-bold u-main-color u-font-30">
				<u-parse :html="goods.goodsName"></u-parse>
			</view>
			<view class="u-line-1 u-tips-color u-font-24 u-m-t-8">
				<u-parse :html="goods.brandName"></u-parse>
			</view>
			<view v-if="goods.activityType || goods.activityType === 0" class="u-line-1 u-tips-color u-font-22 u-m-t-8">
				<tag :couponShowType="2" :activityType="goods.activityType" :couponList="goods.couponList" :actList="goods.activityList" />
			</view>
			<view class="option">
				<view class="price">
					<price :price="goods.goodsPrice" :taxPrice="goods.goodsCostPrice" />
				</view>
				<add-cart :goods="goods" />
			</view>
		</view>
	</view>
</template>

<script>
	import Img from './img.vue'
	import price from './price.vue'
	import addCart from './addCart.vue'
	import tag from '@/components/activity/tag.vue'
	export default{
		components:{ Img, price, addCart, tag },
		props:{
			goods:{
				type:Object,
				default:()=>{}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.goods-card{
		background-color: #fff;
		display: flex;
		padding: 24rpx;
		.left{
			flex-shrink: 0;
		}
		.right{
			flex-grow: 1;
			.option{
				display:flex;
				justify-content: space-between;
				.price{
					align-self: flex-end;
				}
			}
		}
	}
</style>
